<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <button>按钮</button>
    <input type="text">
    <script>
        // 需求 点击按钮后再input里显示被点击了
        // 1.确定事件源 元素
        var but = document.querySelector('button')
        var input = document.querySelector('input')
        // 2.绑定事件 执行程序
        but.onclick = function () {
            input.value = '被点击了'
        // 需求2 表达是可以被禁用的 一般实际开发中通常会 提交一次后就禁用按钮  表单按钮禁用关键词 disabled 赋值为 true 
        // 两种写法
        // 1.某个按钮对象.disalbed = true 
        // but.disabled = true
        // (2)通过this。this = 当前的意思。 根据this会指向事件函数调用者的特性 从而操作该元素对象 即达到了与写法1同样的效果  会简单一点
          this.disabled = true
        }
       
       
    </script>
</body>

</html>